﻿<div data-role="page" id="main">
    <div data-role="header" data-id="fixedheader" data-position="fixed">
        <a href="/" data-icon="back" data-theme="b" data-ajax="false">Back</a>
        <h1>One Day Trip</h1>
    </div>
	<div data-role="content">
        <div class="highlight">            
            <h3>Itinerary for '@Request.QueryString["near"].ToString()'?</h3>            
        </div>
        <ul data-role="listview">
            @foreach (var venue in Model)
            {
                <li>            
                    <a href="#@venue.Id">
                        <img src="@venue.PhotoURL"/>
                        <p><i>@venue.Time</i></p>
                        <h1>@venue.Name</h1>
                            <p>@venue.CheckInCount people have checked-in here</p>
                        <p></p>
                    </a>
                </li>
            }
        </ul>
        <div>
            <h3>Have fun!</h3>
        </div>
    </div><!-- /content -->
    <div data-role="footer" data-id="fixedfooter" data-position="fixed">
		<div data-role="navbar" data-iconpos="top">
		    <ul>
			    <li><a href="#main" data-icon="grid">Itinerary</a></li>
			    <li><a href="#map" data-icon="search">Map</a></li>
			    <li><a href="#email" data-icon="forward">Send to Email</a></li>
		    </ul>
	    </div><!-- /navbar -->
	</div><!-- /footer -->
</div><!-- /page -->
@foreach (var venue in Model)
{   
    <div data-role="page" id="@venue.Id">
        <div data-role="header" data-id="fixedheader" data-position="fixed" data-theme="c">
            <a href="#main" data-icon="back">Back</a>
            <h1>One Day Trip</h1>
        </div>
        <div data-role="content">	            
            <img src="@venue.PhotoURL"/>
            <h1>@venue.Name</h1>
            <p>@venue.Description</p> 
            <p>Here's what other people have been saying about this place</p>
            @foreach (var tips in venue.Tips)
            {
                <blockquote>@tips.Text 
                <br />
                - <i>@tips.User.FirstName @tips.User.LastName</i>
                </blockquote>
                
            }                  
        </div>
        <div data-role="footer" data-id="fixedfooter" data-position="fixed">
		    <div data-role="navbar" data-iconpos="top">
		        <ul>
			        <li><a href="#main" data-icon="grid">Itinerary</a></li>
			        <li><a href="#map" data-icon="search">Map</a></li>
			        <li><a href="#email" data-icon="forward">Email</a></li>
		        </ul>
	        </div>
	    </div>
    </div>
}
<div data-role="page" id="email">
    <div data-role="header" data-id="fixedheader" data-position="fixed">            
        <h1>One Day Trip</h1>
    </div>
    <div data-role="content">	            
        <p>Like this recommendation? Send it to your email for keeps!</p>   
        <form action="/FourSquare/" method="post" data-ajax="false" id="emailForm">
            <input type="text" placeholder="email" id="emailField" name="emailField"/>
            <input type="submit" value="Send to my email" data-ajax="false" /> 
        </form>
    </div>
    <div data-role="footer" data-id="fixedfooter" data-position="fixed">
		<div data-role="navbar" data-iconpos="top">
		    <ul>
			    <li><a href="#main" data-icon="grid">Itinerary</a></li>
			    <li><a href="#map" data-icon="search">Map</a></li>
			    <li><a href="#email" data-icon="forward">Email</a></li>
		    </ul>
	    </div>
	</div>
</div>